//渲染nav
var tmp1 = ""
dataList.navs.forEach((item)=>{
    tmp1 += `<li>
                <a href="./list.html?class=${item.class}">
                    <div class="pic">
                        <img src="${item.icon}"alt="">
                    </div>
                    <div class="my_name">${item.title}</div>
                </a>
            </li>`
})
$(".inner-list").innerHTML = tmp1

//调用函数 取到 查询字符串的值
var flag = getQuaryString("class")

//页面数据
var datas = dataList[flag]

//渲染页面数据
$(".main .bg .img").style.backgroundImage = `url(${datas.banner.bgimg})`
$(".main .bg p").innerText = `${datas.banner.title}`

//渲染title
$(".title h2").innerText = datas.title

//渲染section-head
var tmp2 = `<a href="./detail.html?id=${datas.main.id}" class="left">
                <div class="good">
                    <div class="pic"
                        style="background-image: url('${datas.main.imgurl}');">
                    </div>
                </div>
                <div class="info">
                    <h2>${datas.main.title}</h2>
                    <P>${datas.main.description}</P>
                    <h5>￥${datas.main.price}</h5>
                </div>
            </a>
            <div class="right" style="max-width: 600px; background-image: url('${datas.main.poster}');">
            </div>`
$(".section-head").innerHTML = tmp2

//渲染section-list
var tmp3 = ""
datas.list.forEach((item)=>{
    tmp3 += `<li>
            <a href="./detail.html?id=${item.id}">
                <div class="img">
                    <img src="${item.imgurl}" alt="" width="256">
                </div>
                <div class="hover">
                    <h3>${item.title}</h3>
                    <p>${item.description}</p>
                    <h5>￥${item.price}</h5>
                </div>
            </a>
        </li>`
})
$(".section-list").innerHTML = tmp3

